import React, {
	Component
}
from 'react';

import {
	render
}
from 'react-dom';

import 'antd/lib/index.css';
import '../../../static/flipclock.css';
import '../../../static/style.css';

import {
	Spin, Row, Col, Form, Input, Button, Icon, Table, Badge, Timeline, message, Modal
}
from 'antd';

import {
	TopNav
}
from './top-nav';


function getDay() {
	var today = new Date();
	var dayTag = "" + today.getFullYear() + today.getMonth() + today.getDate();
	return dayTag;
}



var stopSeconds = (18 * 60 + 59) * 60 + 59;


var Book = React.createClass({

	submitBook: function() {
		if (total == 0) {
			alert("请选餐")
			return;
		}

		if (this.refs.inputname.value == "") {
			alert("要写名字")
		} else {
			var Books = Bmob.Object.extend("books");
			var books = new Books();
			books.set("username", this.refs.inputname.value);
			books.set("confirmkey", commonFingerPrint.get());
			books.set("dishes", selected);
			books.set("money", total);
			books.set("bookday", getDay());
			books.save(null, {
				success: function(object) {
					alert('订饭成功');
				},
				error: function(object, error) {
					alert('没订上，再试一次');
					console.log(error);
				}
			});
		}
	},

	render: function() {
		return (
			<div>
				<div className="form-group">
					<label className="control-lable col-sm-4">总计：{this.props.alltotal}元</label>
					<input type="text" ref="inputname" className="form-control" placeholder="请输你的名字" />
				</div>
				
				<input type="button" value="提交" className="btn btn-default" onClick={this.submitBook} />
			</div>
		);
	}
});

var total = 0;
var selected = [];


function addDishes(dishe) {
	total += dishe.price;
	// if (total > 25) {
	// 	alert("超过25了，小心");
	// } 
	selected.push(dishe.name);
	refreshTotal();
}

function removeDishes(dishe) {
	total -= dishe.price;
	for (var i = 0; i < selected.length; i++) {
		if (selected[i] == dishe.name) {
			selected.splice(i, 1);
			break;
		}
	}
	refreshTotal();
}


function refreshTotal() {
	render(
		<Book alltotal={total}/>,
		document.getElementById('bookdiv')
	);
}

var Dishes = React.createClass({

	getInitialState: function() {
		return {
			num: 0
		};
	},

	handlePlus: function(event) {
		var stateNum = this.state.num + 1;
		this.setState({
			num: stateNum
		});
		addDishes(this.props.dishes);
	},
	handleMinus: function(event) {
		var stateNum = this.state.num - 1;
		if (stateNum <= -1) return;
		this.setState({
			num: stateNum
		});
		removeDishes(this.props.dishes);
	},

	render: function() {
		return (
			<div className="form-group" >
							<label className="col-sm-4 control-lable" style={{color:this.state.num<=0? 'black':'red'}} >{this.props.dishes.name}</label>
							<label className="col-sm-3 control-lable" style={{color:this.state.num<=0? 'black':'red'}} >{this.props.dishes.price}元</label>
							<input type="button" value="-" className="btn btn-default col-sm-1"  onClick={this.handleMinus} />
							<div className="col-sm-3"><input type="text" value={this.state.num} className="form-control" style={{color:this.state.num<=0? 'black':'red'}} /></div>
							<input type="button" value="+" className="btn btn-default col-sm-1" onClick={this.handlePlus} />
						</div>
		);
	}
});


class App extends Component {
	constructor(props) {
		super(props);
		this.state = {
			/*			selected: [],
						total: 0*/
		};
	}
	render() {
		return (
			<div>
			<TopNav active="index"/>
			{
				this.props.children
			}
			</div>
		)
	}
}

export {
	App
}